<template>
  <div>
    <h1 v-text="msg" ref="title"></h1>
    <button @click="showDom" ref="btn">点我输出上方DOM元素</button>
    <SchoolInfo ref="sch" />
  </div>
</template>

<script>
import SchoolInfo from "./components/SchoolInfo.vue";

export default {
  name: "App",
  data() {
    return {
      msg: "欢迎你",
    };
  },
  components: { SchoolInfo },
  methods: {
    showDom() {
      // 可以拿到SchoolInfo的实例对象vc
      console.log(this.$refs.sch);
      // 获取真实DOM元素，在Vue代替document.getElementsById
      console.log(this.$refs.btn);
      console.log(this.$refs.title);

    },
  },
};
</script>